<!doctype html>
<html class="no-js" lang="">

<head>
  <meta charset="utf-8">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <title></title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <link rel="manifest" href="site.webmanifest">
  <link rel="apple-touch-icon" href="icon.png">
  <!-- Place favicon.ico in the root directory -->

  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/main.css">

  <!-- custom css -->
  <link rel="stylesheet" href="css/index.css">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/animate.css@3.5.2/animate.min.css"
        integrity="sha384-OHBBOqpYHNsIqQy8hL1U+8OXf9hH6QRxi0+EODezv82DfnZoV7qoHAZDwMwEJvSw" crossorigin="anonymous">

  <link rel="stylesheet" id="Armata-css" href="https://fonts.googleapis.com/css?family=Armata%3A400%2C700&amp;ver=4.9.9"
        type="text/css" media="all">
  <link rel="stylesheet" id="Aldrich-css"
        href="https://fonts.googleapis.com/css?family=Aldrich%3A400%2C700&amp;ver=4.9.9" type="text/css" media="all">
  <link rel="stylesheet" id="Pacifico-css" href="https://fonts.googleapis.com/css?family=Pacifico&amp;ver=4.9.9"
        type="text/css" media="all">
  <link rel="stylesheet" id="Quicksand-css" href="https://fonts.googleapis.com/css?family=Quicksand&amp;ver=4.9.9"
        type="text/css" media="all">

</head>

<body>
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade
  your browser</a> to improve your experience and security.</p>
<![endif]-->

<!-- Add your site or application content here -->
<!--<p>Hello world! This is HTML5 Boilerplate.</p>-->

<div class="your-wrapper">
  <header id="yourHeader" class="your-header">
    <div class="your-container">
      <div class="your-container-sm clear-mrg text-center">
        <div class="your-header-row">
          <div class="your-logo">
            <a href="#">
              <img
                src="img/gandum-unicorn.png">
              <span>.Developer</span>
            </a>
          </div>
          <div class="your-nav">
            <a href="" class="active">2019</a>
            <a href="">2018</a>
            <a href="">2017</a>
          </div>
        </div>
      </div>
    </div>
  </header>

  <div id="yourContainer" class="your-container">
    <div class="sidebox">
      <aside class="widget-card">
        <div class="card-avatar">
          <img
            src="img/me.png">
        </div>
        <div class="card-info">
          <h2>张国栋</h2>
          <p class="text-muted">Web Developer</p>
          <div class="social-list">
            <a href="">
              <img src="img/github.png" alt="">
            </a>
            <a href="">
              <img src="img/gitee.png" alt="">
            </a>
          </div>
        </div>
      </aside>
      <aside class="widget-text">
        <a herf="https://www.smartmiao.com" target="_blank" class="link">Personal Website</a>
      </aside>
    </div>

    <div class="your-container-sm">
      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="about" class="padd-box">
              <h2 class="title-lg text-upper">About Me</h2>
              <p><b>Hello, I’m Smart Miao </b></p>
              <p>你好，我是张国栋。前端高级开发工程师。本人学识渊博、经验丰富，代码风骚、效率恐怖，c/c++ c#、java、php 安卓 ios python node.js
                无不精通玩转，熟练掌握各种框架，并自写语言，创操作系统 写cpu处理器构架，做指令集成
                。深山苦练20余年，一天只睡3小时，千里之外定位问题，瞬息之间修复上线。身体强壮、健步如飞，可连续工作100小时不休息，讨论技术方案9小时不喝水，上至研发cpu芯片、带项目、出方案
                弄计划，下至盗账号、黑网站、shell提权挂马、攻击同行、拍片摄影、泡妞把妹纸、开挖掘机 、威胁pm，啥都能干。</p>
              <div>
                <a class="share-btn">
                  <span class="icon-share"></span>
                  Share
                </a>
              </div>
            </section>
          </div>
        </div>
      </div>

      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="skills" class="padd-box">
              <div class="skills-item">
                <h3>Personal Information</h3>
                <div class="info">
                  <div class="info-item">
                    <div class="text-upper left">Full Name</div>
                    <div class="right">张国栋</div>
                  </div>
                  <div class="info-item">
                    <div class="text-upper left">D.o.b.</div>
                    <div class="right">22 June 1992</div>
                  </div>
                  <div class="info-item">
                    <div class="text-upper left">address</div>
                    <div class="right">潍坊市高新区</div>
                  </div>
                  <div class="info-item">
                    <div class="text-upper left">e-mail</div>
                    <div class="right">hilanmiao@126.com</div>
                  </div>
                  <div class="info-item">
                    <div class="text-upper left">phone</div>
                    <div class="right">18353674768</div>
                  </div>
                  <div class="info-item">
                    <div class="text-upper left">freelance</div>
                    <div class="right">till March 25, 2016</div>
                  </div>
                </div>
              </div>
              <div class="skills-item">
                <h3>Languages</h3>
                <div class="progress-bullets">
                  <strong class="progress-title">Chinese</strong>
                  <span class="progress-bar">
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                  </span>
                  <span class="progress-text">native</span>
                </div>
                <div class="progress-bullets">
                  <strong class="progress-title">English</strong>
                  <span class="progress-bar">
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                  </span>
                  <span class="progress-text">elementary</span>
                </div>
                <div class="progress-bullets">
                  <strong class="progress-title">Japanese</strong>
                  <span class="progress-bar">
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet fill"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                    <span class="bullet"></span>
                  </span>
                  <span class="progress-text">beginner</span>
                </div>
              </div>
            </section>
            <section id="data" class="padd-box">
              <div class="data-item">
                <h3>Professional Skills</h3>
                <div class="progress-line">
                  <strong class="progress-title">Dot Net</strong>
                  <div class="progress-bar" data-text="85%" data-value="0.85"></div>
                </div>
                <div class="progress-line">
                  <strong class="progress-title">NodeJs</strong>
                  <div class="progress-bar" data-text="45%" data-value="0.45"></div>
                </div>
                <div class="progress-line">
                  <strong class="progress-title">Electron</strong>
                  <div class="progress-bar" data-text="65%" data-value="0.65"></div>
                </div>

              </div>
              <div class="data-item">
                <h3>Professional Skills</h3>
                <div class="progress-chart-wrapper">
                  <div class="progress-chart">
                    <div class="progress-bar" data-text="75%" data-value="0.75"></div>
                    <strong class="progress-title">HTML &amp; CSS</strong>
                  </div>
                  <div class="progress-chart">
                    <div class="progress-bar" data-text="85%" data-value="0.85"></div>
                    <strong class="progress-title">JAVASCRIPT</strong>
                  </div>
                  <div class="progress-chart">
                    <div class="progress-bar" data-text="60%" data-value="0.60"></div>
                    <strong class="progress-title">PHOTOSHOP</strong>
                  </div>
                </div>
              </div>
            </section>
          </div>
        </div>
      </div>

      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="exp" class="padd-box">
              <h2 class="title-lg text-upper">work experience</h2>
              <div class="education">
                <div class="education-box">
                  <span class="education-date">
                    <span>2017 - 2019</span>
                  </span>
                  <h3>全栈工程师/研发四部经理</h3>
                  <div class="education-logo">
                    <img height="35"
                         src="img/company-jd.png">
                  </div>
                  <a target="_blank" href="http://www.kindesoft.com/"> <span
                    class="education-company">山东京帝软件有限公司</span>
                  </a>
                  <p>
                    研发四部(.Net)部门经理，负责云服务平台软件的研发及管理。
                    带领团队完成云服务接口设计，移动端体验设计改进，质量管控等工作。
                    <br>先行技术部成员，负责前端基础技术框架的设计、研发。
                  </p>
                </div>
                <div class="education-box">
                  <span class="education-date">
                    <span>2014 - 2016</span>
                  </span>
                  <h3>.Net研发工程师</h3>
                  <div class="education-logo">
                    <img height="35"
                         src="img/company-ad.png">
                  </div>
                  <a target="_blank" href="http://www.anshield.net/"> <span
                    class="education-company">潍坊安盾软件有限公司</span>
                  </a>
                  <p>
                    研发四部(.Net)部门经理，负责云服务平台软件的研发及管理。
                    带领团队完成云服务接口设计，移动端体验设计改进，质量管控等工作。
                    <br>先行技术部成员，负责前端基础技术框架的设计、研发。
                  </p>
                </div>
              </div>
            </section>

            <section id="timeline" class="padd-box">
              <h2 class="title-lg text-upper">Education</h2>
              <div class="education">
                <div class="education-box">
                  <span class="education-date">
                    <span>2011 - 2013</span>
                  </span>
                  <h3>山东商业职业技术学院</h3>
                  <span class="education-company">软件技术专业，主修Java、C#、Oracle数据库设计等</span>
                </div>
                <div class="education-box">
                  <span class="education-date">
                    <span>2013 - 2014</span>
                  </span>
                  <h3>济南东忠软件有限公司</h3>
                  <span class="education-company">主要培训项目管理、.Net编程、测试、文档及日语</span>
                </div>
              </div>
            </section>
          </div>
        </div>
      </div>

      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="portfolio" class="padd-box">
              <h2 class="title-lg text-upper">Portfolio</h2>
              <div class="pf-filter padd-box">
                <button data-filter="*" class="active">All</button>
                <button data-filter=".pf-design">Design</button>
                <button data-filter=".pf-team" class="">Team</button>
                <button data-filter=".pf-work" class="">Work</button>
              </div>
              <div class="pf-grid">

              </div>
            </section>
          </div>
        </div>
      </div>

      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="interests" class="padd-box">
              <div>
                <h2 class="title-lg text-upper">Interests</h2>
                <div class="icon-list">
                  <div class="row">
                    <div class="item"><span class="icon-animal-lover"></span>小猫小狗</div>
                    <div class="item"><span class="icon-island"></span>户外活动</div>
                    <div class="item"><span class="icon-bicycle"></span>山地车</div>
                  </div>
                  <div class="row">
                    <div class="item"><span class="icon-party"></span>KTV</div>
                    <div class="item"><span class="icon-magic"></span>大型游戏</div>
                    <div class="item"><span class="icon-coffee"></span>咖啡</div>
                  </div>
                </div>
              </div>
            </section>
          </div>
        </div>
      </div>

      <div class="pager-layers">
        <div class="pager">
          <div class="pager-cont">
            <section id="wisdom" class="padd-box">
              <div>
                <h2 class="title-lg text-upper">Wisdom</h2>
                <ul class="togglebox">
                  <li>
                    <h3 class="togglebox-header">
                      Talk is cheap. Show me the code. —— Linus Torvalds
                      <br>
                      <span>能说算不上什么，有本事就把你的代码给我看看。Linux的创始人托瓦兹 </span>
                    </h3>
                  </li>
                  <li>
                    <h3 class="togglebox-header">
                      go big or go home. —— Facebook
                      <br>
                      <span>要么牛逼，要么滚蛋。脸书的办公室标语 </span>
                    </h3>
                  </li>
                  <li>
                    <h3 class="togglebox-header">
                      Eating our own dog food. —— Microsoft
                      <br>
                      <span>吃我们自己的狗食。微软每天研发工作的一部分就是使用自己正在开发的软件 </span>
                    </h3>
                  </li>
                  <li>
                    <h3 class="togglebox-header">
                      Stay hungry Stay foolish. —— Steve Jobs
                      <br>
                      <span>求知若饥,虚心若愚。乔老爷子的名言，保持饥饿,保持愚蠢这样翻译感觉更接地气</span>
                    </h3>
                  </li>
                </ul>
              </div>
            </section>
          </div>
        </div>
      </div>

    </div>

    <div class="nav-scroll">
      <div class="nav-img">
        <a href="#">
          <img src="img/me.png" alt="">
        </a>
      </div>
      <div class="nav-list">
        <a href="#">
          <span class="icon-portfolio"></span>
        </a>
        <a href="#">
          <span class="icon-experience"></span>
        </a>
        <a href="#">
          <span class="icon-references"></span>
        </a>
        <a href="#">
          <span class="icon-blog"></span>
        </a>
        <a href="#">
          <span class="icon-contact"></span>
        </a>
      </div>
    </div>

  </div>

  <footer id="yourFooter" class="your-footer">
    <div class="your-container">
      <div class="your-container-sm clear-mrg text-center"><p>Smartmiao Resume 2019</p></div>
    </div>
  </footer>

  <button id="yourBtnUp" class="your-btn-up">
    <span class="icon-arrow-page-up"></span>
  </button>

  <svg id="yourBgShape1" height="519" width="758">
    <polygon class="pol" points="0,455,693,352,173,0,92,0,0,71"></polygon>
  </svg>

  <svg id="yourBgShape2" height="536" width="633">
    <polygon points="0,0,633,0,633,536"></polygon>
  </svg>
</div>

<script src="js/vendor/modernizr-3.6.0.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.3.1.min.js"><\/script>')</script>
<!-- custom script -->
<!--<script src="https://cdn.jsdelivr.net/npm/progressbar.js"-->
<!--integrity="sha384-+MB7mVdgGAlyAS7A+FqQOuwVhL6IRzG0jAtLNDJJAehFcoie4paivYgcn5QMhkOm"-->
<!--crossorigin="anonymous"></script>-->
<script>window.ProgressBar || document.write('<script src="js/vendor/progressbar.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>

<!-- custom script -->
<script src="js/animate.js"></script>
<script src="js/progress-bar.js"></script>


<!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->
<script>
  window.ga = function () {
    ga.q.push(arguments)
  };
  ga.q = [];
  ga.l = +new Date;
  ga('create', 'UA-XXXXX-Y', 'auto');
  ga('send', 'pageview')
</script>
<script src="https://www.google-analytics.com/analytics.js" async defer></script>
</body>

</html>
